<%@ page language="java" pageEncoding="UTF-8" %>
<%@ include file="/common/taglibs.jsp" %>

<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <%@ include file="/common/res.jsp" %>
    <%@ include file="/common/res-datatable.jsp" %>
    <title>订单管理</title>
</head>
<body>
<%@ include file="/common/head.jsp" %>
<div class="wrap-container">
    <div class="row">
        <div class="col-md-3 col-lg-2">
            <%@ include file="/common/left.jsp" %>
        </div>
        <div class="col-md-9 col-lg-10">
            <div class="cms-common-content">
                <h3>订单管理</h3>
                <div class="bltitle-content">
                    <form id="searchForm">
                        <%--隐藏域--%>
                        <input type="hidden" id="search_orderStatus" name="search_orderStatus"  />
                        <input type="hidden" id="search_refundStatus" name="search_refundStatus"  />
                        <table class="cms-change-table" cellpadding="0" cellspacing="0">
                            <tbody>
                            <tr>
                               <td class="search-label">订单日期：</td>
                                <td class="search-input">
                                    <input type="text" style="width: 120px;" name="search_startTime" id="search_startTime" class="form-control Wdate" placeholder="开始时间" onfocus="WdatePicker({dateFmt:'yyyy-MM-dd',maxDate:'#F{$dp.$D(\'search_endTime\')}'})">
                                    <input type="text" style="width: 120px;" name="search_endTime"  id="search_endTime" class="form-control Wdate" placeholder="结束时间" onfocus="WdatePicker({dateFmt:'yyyy-MM-dd',minDate:'#F{$dp.$D(\'search_startTime\')}',maxDate:'2020-10-01'})">
                                </td>
                                <td class="search-label">订单编号：</td>
                                <td class="search-input">
                                    <input type="text" name="search_orderNo"  class="form-control " placeholder="输入订单编号"  />
                                </td>
                            </tr>
                            <tr>
                                <td class="search-label">下单用户名称：</td>
                                <td class="search-input">
                                    <input type="text" name="search_userName" class="form-control" placeholder="下单用户名称">
                                </td>
                               	<td class="search-label">下单用户手机：</td>
                                <td class="search-input">
                                    <input type="text" name="search_userPhoneNo"  class="form-control " placeholder="输入下单用户手机"  />
                                </td>
                            </tr>
                            <tr>
                                <td class="search-label">洗车工名称：</td>
                                <td class="search-input">
                                    <input type="text" name="search_washerName" class="form-control" placeholder="输入洗车工名称">
                                </td>
                                <td class="search-label">洗车工手机：</td>
                                <td class="search-input">
                                    <input type="text" name="search_washerPhoneNo" class="form-control" placeholder="输入洗车工手机号">
                                </td>
                            </tr>
                            </tbody>
                        </table>
                        <p class="search-actionBtn clearfix">
                            <button type="submit" class="btn btn-primary">查询</button>
                            <button type="reset" class="btn btn-default">重置</button>
                        </p>
                    </form>
                </div> <!--/.bltitle-content-->
            </div><!--/.cms-common-content-->
            <div class="row">
                <div class="col-md-3" style="width:70%">
                    <ul class="nav nav-pills nav-justified table-navbar" id="table-navbar">
                    	<!-- 订单状态(R01-待支付 R02-待接单 R03-已接单 R04-洗车中 R05-待评价 R06-已完成 R07-补差价 R08-已取消 1-待退款 2-已退款) -->
                        <li role="presentation" class="active" width="20px">
                            <a href="javascript:;" onclick="$('#search_orderStatus').val('');$('#search_refundStatus').val('');$('#searchForm').submit();" >全部</a>
                        </li>
                        <li role="presentation" width="20px"><a  href="javascript:;" onclick="$('#search_orderStatus').val('R01');$('#search_refundStatus').val('');$('#searchForm').submit();">待支付</a></li>
                        <li role="presentation" width="20px"><a  href="javascript:;" onclick="$('#search_orderStatus').val('R02');$('#search_refundStatus').val('');$('#searchForm').submit();">待接单</a></li>
                        <li role="presentation" width="20px"><a  href="javascript:;" onclick="$('#search_orderStatus').val('R03');$('#search_refundStatus').val('');$('#searchForm').submit();">已接单</a></li>
                        <li role="presentation" width="20px"><a  href="javascript:;" onclick="$('#search_orderStatus').val('R04');$('#search_refundStatus').val('');$('#searchForm').submit();">洗车中</a></li>
                        <li role="presentation" width="20px"><a  href="javascript:;" onclick="$('#search_orderStatus').val('R06');$('#search_refundStatus').val('');$('#searchForm').submit();">已完成</a></li>
                        <li role="presentation" width="20px"><a  href="javascript:;" onclick="$('#search_orderStatus').val('R08');$('#search_refundStatus').val('');$('#searchForm').submit();">已取消</a></li>
                        <li role="presentation" width="20px"><a  href="javascript:;" onclick="$('#search_refundStatus').val('1');$('#search_orderStatus').val('');$('#searchForm').submit();">待退款</a></li>
                        <li role="presentation" width="20px"><a  href="javascript:;" onclick="$('#search_refundStatus').val('2');$('#search_orderStatus').val('');$('#searchForm').submit();">已退款</a></li>

                    </ul>
                </div>
            </div>

            <div class="clearfix">
                <table id="order-datatables"
                       class="table table-striped table-bordered table-hover" cellspacing="0" width="100%"></table>
            </div>
        </div>
        <!--/.col-md-12-->
    </div>
    <!--/.row-->
</div>
<script>
    $(function () {
        //定时刷新
        setInterval(flush,30000);
        function flush(){
            oTable.ajax.reload( null , true)
        }


    	var rowActionTpl_R01 = $('#tableActionTpl_R01').html(); //获取模板引擎
        var rowActionTpl_R02 = $('#tableActionTpl_R02').html(); //获取模板引擎
        var rowActionTpl_R03 = $('#tableActionTpl_R03').html(); //获取模板引擎
        var rowActionTpl_R04 = $('#tableActionTpl_R04').html(); //获取模板引擎
        var rowActionTpl_refund = $('#tableActionTpl_refund').html(); //获取模板引擎


    	
        var  orderMobileTpl = $('#orderMobileTpl').html(),orderStatusTpl = $('#orderStatusTpl').html(),
                consignInfoTpl = $('#consignInfoTpl').html(),startDistLotyTmp = $('#startDistLotyTmp').html(),
                settlementStatusTpl = $('#settlementStatusTpl').html(),orderInfoTpl = $('#orderInfoTpl').html(); //获取模板引擎
        //jquery datatables
        window.oTable = $('#order-datatables').DataTable({
            'processing': true,
            'serverSide': true,
            'ajax': {
                "url": P.ctx + '/op/order/datatables.json',
                "type": "POST",
                'data': function (d) {
                    return $.extend({}, d,  buildParam());
                }
            },
            'columns': [
                {'data': 'orderNo', 'title': '订单编号', width: '10%', orderable: true},
                {'data': 'orderStatusName', 'title': '订单状态', width: '8%', orderable: true},
                {'data': 'createTime', 'title': '下单时间', width: '7%', orderable: true},
                {'data': 'modifyTime', 'title': '更新时间', width: '7%', orderable: true},
                {
                    'data': 'orderMobile', 'title': '下单用户', width: '11%', orderable: false,
                    render: function (data, type, row) {
                        return P.render(orderMobileTpl, row);
                    }
                },
                {
                    'data': 'merchId', 'title': '产品信息', width: '20%',orderable: false,
                    render: function (data, type, row) {
                        return P.render(startDistLotyTmp, row);
                    }
                },
                {
                    'data': 'merchId', 'title': '订单联系人/洗车工',width: '14%', orderable: false,
                    render: function (data, type, row) {
                        return P.render(consignInfoTpl, row);
                    }
                },
                {
                    'data': 'buyerThirdPayNo', 'title': '订单信息',width: '12%', orderable: false,
                    render: function (data, type, row) {
                        return P.render(orderInfoTpl, row);
                    }
                },
                {'data': 'refundStatusName', 'title': '退款状态', width: '7%', orderable: true},
                {
                    'data': 'orderNo', 'title': '操作', width: '7%', orderable: false, class: 'text-left',
                    render: function (data, type, row) {
                        row.isSupperAdmin = row.id == 1;
                        <!-- 订单状态(R01-待支付 R02-等待接单 R03-已接单 R04-洗车中 R05-待评价 R06-已完成 R07-补差价 R08-已取消 R09-待退款 R10-已退款) -->
                        if('待支付' == row.orderStatusName){ //待支付
                            return P.render(rowActionTpl_R01, row);  // 取消
                        }else if('等待接单' == row.orderStatusName){ //待接单
                            return P.render(rowActionTpl_R02, row);  // 取消和接单
                        }else if('已接单' == row.orderStatusName){ //已接单
                            return P.render(rowActionTpl_R03, row);  // 开始洗车
                        }else if('洗车中' == row.orderStatusName){ //洗车中
                            return P.render(rowActionTpl_R04, row);  // 完成
                        }else if('1' == row.refundStatus){ //待退款
                            return P.render(rowActionTpl_refund, row);  //已退款
                        }

                    }
                }
            ],
            'columnDefs': [
                {'defaultContent': '', targets: '_all'}
            ],
           'order': [[3, 'desc']],
            dom: '<"clearfix">rpitip',
//            "scrollX": true,
            'paginate': true,
            language: {
                sSearch: '<span>搜索:</span> ',
                info: '显示_START_到_END_条,共_TOTAL_条记录',
                infoEmpty: '显示0到0条,共0条记录',
                lengthMenu: '每页_MENU_条',
                processing: '正在处理...',
                emptyTable: '<div class="alert no-margin" style="font-size:12px;padding:5px;">无可用数据</div>',
                zeroRecords: '<div class="alert no-margin" style="font-size:12px;padding:5px;">无记录数据</div>',
                search: '输入搜索',
                paginate: {'first': '首页', 'previous': ' 上一页 ', 'next': ' 下一页 ', 'last': ' 尾页 '}
            }
        });


        function buildParam() {
            return $.extend($('#searchForm').serializeObject(), {})
        }

        //搜索表单
        $('#searchForm').on('submit',function(e){
            e.preventDefault();
            window.refreshParentDataGrid(true);
        });

        //行：操作 接单
        $('#order-datatables').on('click', '[name="receOrder"]', function (e) {
            e.preventDefault();
            var jsonObj = $(this).data();
            //向子页面传递数据
            jsonObj.orderNo=jsonObj.order_no;
            jsonObj.userId=jsonObj.user_id;
            openDialog(jsonObj) ;
        });


        function openDialog(param) {
            var _params = $.extend({}, param);
            bootbox.dialog({
                message: "&nbsp;",
                title: "接单操作",
                buttons: {
                    close: {
                        label: "关闭",
                        className: "btn-default",
                        callback: function () {
                            bootbox.hideAll();
                            return false;
                        }
                    }
                }
            });
            $('#bootbox-body').load2('${ctx}/op/order/rece', _params)
        }


        //行：操作 取消订单
        $('#order-datatables').on('click', '[name="cancelOrder"]', function (e) {
            e.preventDefault();
            var jsonObj = $(this).data();
            //向子页面传递数据
            jsonObj.orderNo=jsonObj.order_no;
            jsonObj.userId=jsonObj.user_id;
            jsonObj.orderStatus = "R08";

            if (window.confirm('请再次确认是否要取消订单？')) {
                $.ajax({
                    url: P.ctx + '/op/order/update',
                    type: 'post',
                    data: jsonObj,
                    success: function (resp) {
                        P.messager({content:resp.msg,type:resp.success==true?'success':'error'}) ;
                        if(resp.success==true){
                            oTable.ajax.reload( null , true)
                        }

                    }
                });
            }
        });

        //行：操作 开始洗车
        $('#order-datatables').on('click', '[name="beginWashCar"]', function (e) {
            e.preventDefault();
            var jsonObj = $(this).data();
            //向子页面传递数据
            jsonObj.orderNo=jsonObj.order_no;
            jsonObj.userId=jsonObj.user_id;
            jsonObj.orderStatus = "R04";

            if (window.confirm('请再次确认是否开始洗车？')) {
                $.ajax({
                    url: P.ctx + '/op/order/update',
                    type: 'post',
                    data: jsonObj,
                    success: function (resp) {
                        P.messager({content:resp.msg,type:resp.success==true?'success':'error'}) ;
                        if(resp.success==true){
                            oTable.ajax.reload( null , true)
                        }

                    }
                });
            }
        });

        //行：操作 操作完成
        $('#order-datatables').on('click', '[name="endOrder"]', function (e) {
            e.preventDefault();
            var jsonObj = $(this).data();
            //向子页面传递数据
            jsonObj.orderNo=jsonObj.order_no;
            jsonObj.userId=jsonObj.user_id;
            jsonObj.orderStatus = "R06";

            if (window.confirm('请再次确认是否要完成订单？')) {
                $.ajax({
                    url: P.ctx + '/op/order/update',
                    type: 'post',
                    data: jsonObj,
                    success: function (resp) {
                        P.messager({content:resp.msg,type:resp.success==true?'success':'error'}) ;
                        if(resp.success==true){
                            oTable.ajax.reload( null , true)
                        }

                    }
                });
            }
        });

        //行：操作 退款操作
        $('#order-datatables').on('click', '[name="refund"]', function (e) {
            e.preventDefault();
            var jsonObj = $(this).data();
            //向子页面传递数据
            jsonObj.orderNo=jsonObj.order_no;
            jsonObj.userId=jsonObj.user_id;
            jsonObj.orderStatus = "";
            jsonObj.refundStatus = "2";

            if (window.confirm('请再次确认是否要进行退款？')) {
                $.ajax({
                    url: P.ctx + '/op/order/update',
                    type: 'post',
                    data: jsonObj,
                    success: function (resp) {
                        P.messager({content:resp.msg,type:resp.success==true?'success':'error'}) ;
                        if(resp.success==true){
                            oTable.ajax.reload( null , true)
                        }

                    }
                });
            }
        });




        //全局函数::刷新表格
        window.refreshParentDataGrid = function (resetPaging) {
            oTable.ajax.reload( null , resetPaging == true)
        }


    });//Dom ready
</script>


<!--表格操作列模板定义-->
<script id="tableActionTpl_R01" type="text/x-mustache">
    <div class="row-actions">
        <span>
             <button type="button" data-order_no="{{orderNo}}" data-user_id="{{userId}}"  class="btn btn-primary" name="cancelOrder">取消</button>
        </span>
    </div>
</script>

<script id="tableActionTpl_R02" type="text/x-mustache">
    <div class="row-actions">
        <span>
             <button type="button"  data-order_no="{{orderNo}}" data-user_id="{{userId}}"  class="btn btn-primary" name="cancelOrder">取消</button>
        </span>
        <br/>
        <br/>
        <span>
            <button type="button" data-order_no="{{orderNo}}" data-user_id="{{userId}}"  class="btn btn-primary" name="receOrder">接单</button>
        </span>
    </div>
</script>

<script id="tableActionTpl_R03" type="text/x-mustache">
    <div class="row-actions">
        <span>
             <button type="button"  data-order_no="{{orderNo}}" data-user_id="{{userId}}"  class="btn btn-primary" name="cancelOrder">取消</button>
        </span>
        <br/>
        <br/>
        <span>
             <button type="button"  data-order_no="{{orderNo}}" data-user_id="{{userId}}"  class="btn btn-primary" name="beginWashCar">洗车</button>
        </span>
    </div>
</script>

<script id="tableActionTpl_R04" type="text/x-mustache">
    <div class="row-actions">
        <span>
             <button type="button" data-order_no="{{orderNo}}"  data-user_id="{{userId}}"  class="btn btn-primary" name="endOrder">完成</button>
        </span>
    </div>
</script>

<script id="tableActionTpl_refund" type="text/x-mustache">
    <div class="row-actions">
        <span>
             <button type="button" data-order_no="{{orderNo}}"  data-user_id="{{userId}}"  class="btn btn-primary" name="refund">退款</button>
        </span>
    </div>
</script>



<%--下单用户模板--%>
<script id="orderMobileTpl" type="text/x-mustache">
    <div>用户ID：{{userId}}</div>
    <div>用户姓名：{{userName}}</div>
    <div>用户昵称：{{nickName}}</div>
    <div>手机号码：{{userPhoneNo}}</div>
    <div>手机型号：{{deviceTypeName}}</div>
    <div>用户等级：{{userRankName}}</div>
</script>
<%--订单联系人/洗车工模板--%>
<script id="consignInfoTpl" type="text/x-mustache">
    <div>用户姓名：{{userName}}</div>
    <div>用户手机：{{userPhoneNo}}</div>
    <div>联系人姓名：{{linkman}}</div>
    <div>联系人手机：{{linkmanPhoneNo}}</div>
    <div>详细地址：{{provinceName}} {{cityName}} {{areaName}} {{roomName}} {{detailAddress}}</div>
    <div>洗车工ID：{{washerId}}</div>
    <div>洗车工姓名：{{washerName}}</div>
    <div>洗车工性别：{{washerSex}}</div>
    <div>洗车工手机：{{washerPhoneNo}}</div>
</script>
<%--产品信息模型--%>
<script id="startDistLotyTmp" type="text/x-mustache">
     <div>{{provinceName}} {{cityName}} {{areaName}} {{roomName}}</div>
     <div class="">{{carNo}} {{brandName}} {{seriesName}} {{carTypeName}} {{carLibTypeName}} </div>
	 <div class="">开始时间：{{bookStartTime}}</div>
	 <div class="">结束时间：{{bookEndTime}}</div>
	 <div class="">产品类型：{{washTypeName}}</div>
	 <div class="">标准价格：{{productPrice}}</div>
	 <div class="">会员价格：{{userRankPrice}}</div>
	 <div class="">尊享价格：{{enjoyPrice}}</div>
</script>
<%--订单信息模板--%>
<script id="orderInfoTpl" type="text/x-mustache">
	 <div class="">订单价格：{{resultProductPrice}}</div>
	 <div class="">预约优惠：{{bookDiscPrice}}</div>
	 <div class="">使用优惠券：{{couponNo}} {{couponAmount}}</div>
	 <div class="">使用积分：{{payIntegral}}</div>
	 <div class="">支付信息：{{thirdPayCallBackStrName}} {{payTypeName}} {{payAmount}}</div>
	 <div class="">退款信息：{{refundStatusName}} {{refundAmount}}</div>
</script>
</body>
</html>